<template>
  <view class="containter">
    <z-paging ref="paging" v-model="dataList" :auto="false" @query="queryList" >
      <view class="search-box" slot="top">
        <uv-search placeholder="请输入搜索内容" v-model="params.keyword" @search="handleSearch" @clear="handleSearch"
          @custom="handleSearch"></uv-search>
      </view>
      <List :dataList="dataList"></List>
    </z-paging>
  </view>
</template>

<script>
  import reqApi from "../../api/api.js";
  export default {
    data() {
      return {
        params: {
          page: 1,
          limit: 10,
          keyword: ""
        },
        dataList: [],
        type: null
      }
    },
    onLoad(option) {
      this.type = option.type;
      this.$nextTick(() => {
        this.$refs.paging.reload();
      })
    },
    // onShow() {
    //   this.$nextTick(() => {
    //     this.$refs.paging.reload();
    //   })
    // },
    methods: {
      queryList(pageNo, pageSize) {
        this.params.page = pageNo;
        this.params.limit = pageSize;
        // 此处请求仅为演示，请替换为自己项目中的请求
        console.log("type", this.type);
        // type 1 运营 2商务
        if(this.type == 1){
          reqApi.setList(this.params).then(res => {
            console.log("返回的结果", res);
            // 将请求结果通过complete传给z-paging处理，同时也代表请求结束，这一行必须调用
            this.$refs.paging.complete(res.data.list);
          })
        }else{
          reqApi.getList(this.params).then(res => {
            console.log("返回的结果", res);
            // 将请求结果通过complete传给z-paging处理，同时也代表请求结束，这一行必须调用
            this.$refs.paging.complete(res.data.list);
          })
        }
        
      },
      handleSearch() {
         this.$refs.paging.reload();
      }
    }
  }
</script>

<style lang="scss" scoped>
  .containter {
    .search-box {
      padding: 10rpx 28rpx;
      background: #fff;
    }
  }
</style>